<template>
  <div class="rsr-view">
    <div class="rsr-view__url-card">
      <view-url :id="resourceId" />
    </div>
    <div class="rsr-view__ads-card">
      <view-ads spaceCode="ADS_2" />
    </div>
    <div class="rsr-view__comments">
      <view-comment :resource_id="resourceId" />
    </div>
  </div>
</template>

<script>
import viewUrl from '@/components/board-url';
import viewAds from '@/components/ads';
import viewComment from '@/components/board-comment'
export default {
  name: 'scs-dest',
  data() {
    return {
      resourceId:sa.$sys.getSrId()
    }
  },
  components: {
    viewUrl,
    viewAds,
    viewComment
  },
}
</script>

<style lang="scss" scoped>
@import '@/styles/mixin.scss';

.rsr-view {
  display: flex;
  justify-content: start;
  flex-direction: column;
  align-items: center;
  text-align: center;
  height: 100%;
  width: 100%;
  padding: 0px 20px;
  gap: 20px;
}

.rsr-view__url-card {
  width: 100%;
  max-height: 40%;
}

.rsr-view__ads-card {
  width: 100%;
  max-height: 20%;
  border-radius: 5px;
}

.rsr-view__comments {
  width: 100%;
  border-radius: 5px;
  max-height: 60%;
  overflow:auto;
}
</style>
